<template>
  <div class="index" >
    <download-head v-if="showDownloadHead" :callback="closeHead" class="download-head"></download-head>
    <v-header class="tab-header" v-on:stopDanMu="stopDanMu" :screenName="screenName" :class="{downTab: showDownloadHead}" :points="result.point" :islogin="result.is_login" v-on:showDialogByType="showDialogByType" v-on:listenToShowScreen="showOrHiddenScreen" v-on:listenToRefreshForLogin="refreshData"></v-header>
    <active-list ref="activelist" class="active-content" :bannerUrl="result.banner_url" :loadDataSuccess="loadDataSuccess" :class="{downContent: showDownloadHead}" :activities="result.data" :horselamp="result.horselamp" :topshow="result.top_isshow" :islogin="result.is_login" :style="{ minHeight: minh + 'rem' }" v-on:listenToRefreshForLogin="refreshData" v-on:listenToShowDialog="showDialogByType"></active-list>
    <screen-view class="screen-view" @click.native="showOrHiddenScreen" :class="{downScreen: showDownloadHead}" v-show="showScreen" v-on:listenToScreening="screening"></screen-view>
    <join-result-dialog v-if="showDialog" v-on:listenToDialog="listenToDialog" :type="dialogType" :shareTitle="goodsShareTitle"
      :shareConent="goodsShareContent" :shareUrl="goodsShareUrl" :shareImgUrl="goodShareImgUrl"></join-result-dialog>
  </div>
</template>

<script type="text/ecmascript-6">
  import VHeader from './Header.vue'
  import ActiveList from './ActiveList.vue'
  import ScreenView from './ScreenView.vue'
  import refreashData from '../../../static/js/dropload/dropload.min.js'
  import downloadHead from '../../components/downloadhead/DownloadHead.vue'
  import JoinResultDialog from '../../components/join_result_dialog/JoinResultDialog.vue'
  const ERR_OK = '0';

  export default {
    components: {
      VHeader, ActiveList, ScreenView, downloadHead, JoinResultDialog
    },
    data() {
      return {
        minh: 0,
        result: {},
        showScreen: false,
        dataType:"1",
        screenName: '筛选',
        urid: "",
        showDownloadHead: false,
        showDialog: false,
        dialogType: '',
        loadDataSuccess: false,
        goodsShareTitle: '',
        goodsShareContent: '',
        goodShareImgUrl: '',
        goodsShareUrl: '',
        isRequesting: false
      }
    },
    methods: {
      loadData(callback) {
        if (this.isRequesting) {
          return
        }
        this.isRequesting = true
        let url = '/Jfproduct/index'
        if (this.wccconfig.urlParams) {
          url += this.wccconfig.urlParams
          url += ('&jf_type=' + this.dataType)
        } else {
          url += "?"
          url += ('jf_type=' + this.dataType)
        }
        if (!this.wccconfig.isApp) {
          //如果不是当前app,请求接口，去掉urid
          url = this.utils.removeQueryString(url, ['urid'])
        }
        let vue = this
        this.$http.get(this.wccconfig.buildUrl(url)).then((response) => {
          vue.isRequesting = false
          response = response.body
          this.loadDataSuccess = true
          if (response.errno === ERR_OK) {
            vue.utils.clearCountdownFuncs()
            vue.result = response
            if (vue.utils.supportShare()) {
              let shareUrl;
              if (location.href.indexOf("?") !== -1) {
                shareUrl= location.href.substring(0, location.href.indexOf("?"))
              } else {
                shareUrl = location.href
              }
              vue.wccia.share(vue.result.share_title, vue.result.share_content, shareUrl, vue.result.share_img_url, true)
            }
            if (callback && callback instanceof Function) {
              callback()
            }
          }
        },(error) => {
            this.isRequesting = false
        });
      },
      stopDanMu() {
        this.$refs.activelist.stopDanMu()
      },
      showOrHiddenScreen() {
        this.showScreen = !this.showScreen
      },
      screening(type, title) {
        this.dataType = type
        this.screenName = title
        this.showScreen = false
        this.loadData()
      },
      refreshData(param) {
        if (param) {
          this.urid = param
          this.wccconfig.urlParams = this.utils.updateUrl(this.wccconfig.urlParams, 'urid', this.urid)
        }
        this.loadData()
      },
      closeHead() {
        this.showDownloadHead = false
      },
      listenToDialog(type) {  /** type： 1-分享；2-扫码；3-看看其他；4-OK**/
        this.showDialog = !this.showDialog
      },
      showDialogByType(type, shareTitle, shareContent, shareUrl, shareImgUrl){
        if (type === '0'
              || type === '1'
              || type === '2'
              || type === '4'
              || type === '5'
              || type === '6'
              || type === '7') {
          this.goodsShareTitle = shareTitle
          this.goodsShareContent = shareContent
          this.goodShareImgUrl = shareImgUrl
          this.goodsShareUrl = shareUrl
          this.showDialog = true
          this.dialogType = type
          if (type === '0'
            || type === '1'
            || type === '2'
            || type === '7') {
              this.loadData()
          }
        }
      },
      getShareUrl(){
        return this.utils.removeQueryString(location.href, ['urid']);
      }
    },
    created() {
      let vue = this
      if (!this.wccconfig.isApp) {
        this.showDownloadHead = true
      }
      this.wccconfig.urlParams = this.utils.getUrlParams(location.href)
      vue.minh = 11.62
      setTimeout(function(){
        vue.utils.doPvTJ('积分众筹', vue.utils.getQueryString(location.href, 'entry'))
      },100)
      this.loadData()
      var vueThis = this
      $(function () {
        $('.active-content').dropload({
          scrollArea: window,
          loadUpFn: function (me){
            vueThis.loadData(function() {
              me.resetload()
            })
          }
        })
      })
    }
  }
</script>

<style lang="stylus" rel="stylesheet/stylus">
  .index
    position relative
    font-family STXihei
    text-align center
    padding-bottom .2rem
    .download-head
      z-index 1002
    .dropload-up
      margin-top .92rem
      background-color #688be9
      padding-top .2rem
      font-size .24rem
    .tab-header
      position fixed
      top 0
      z-index 1000
      background-color #fff
      border-bottom 1px solid rgba(7, 17, 27, 0.1)
      &.downTab
        top .95rem
    .active-content
      margin-top 0.92rem
      &.downContent
        margin-top 1.87rem
    .screen-view
      position fixed
      top .92rem
      z-index 1000
      background-color rgba(0, 0, 0, 0.5)
      &.downScreen
        top 1.87rem
</style>
